http://www.two4u.com/bg-faq/One can specify more than just the background only (for example it's possible to change the color of the text). The way to effect that, depends on the browser. There are two types browsers:
BODY element that influence the appearance of the
background of the document, the text and also the links. Here is an
overview of the attributes:
BACKGROUNDBGCOLORTEXTLINKVLINKALINKBACKGROUND attribute you'll have to hand the URL to
the background image, like this: BACKGROUND="my_image.gif".BGCOLOR, TEXT,
LINK, VLINK and ALINK) require
a six-characters-long color value in HEX-format.
It will look like this: BGCOLOR="#FFFFFF".
Netscape and Internet Explorer do allow descriptions of colors
(e.g. BGCOLOR="Green"), but there is no list
of colornames that work fine in both browsers. There is a
list however at Netscape that's pretty neat.
man dc; man bc'). If you want a more spiffy interface
use the incredible handy Color Picker 2.0
made by Michael Bostock (requires support of DHTML of your browser). If that
doesn't work use the online converter at
http://www.two4u.com/color/dec-hex.html.
If you're still curious how it all works: Netscape wants a color value
in this format: #RRGGBB, where RR specifies
the value of the Red component of the color, GG the
Green component and BB the Blue component. As you can see
each component has two positions and the value should be in HEX
format. In HEX the numbers run up from 0 to 9
and after that from A to F, therefore
having a base of 16 characters instead of the decimal system which
has a base of 10 characters. Let's say you have a HEX value
C6, that would be 12 x 16 + 6 = 198 in the
decimal system.
Having two positions for each component
of the color means that the maximum value for the component would be
FF (255 in the decimal system) and that there
are 256^3 (16,777,216) possible color combinations for each attribute.
In browsers other than the ones that support style sheets or Netscape's
Navigator you can't change the background in the middle of the HTML document.
The most used way of creating a background is the one that was introduced
with Netscape Navigator 1.1. Using the method this browser introduced, a
HTML document will have this structure (place the BODY
tag right after the HEAD tag):
<HTML>
<HEAD>
...
</HEAD>
<BODY ...>
...
</BODY>
</HTML>
Netscape's Navigator 3.0 allows the BGCOLOR attribute to be used
within tables. Only BGCOLOR will work, BACKGROUND
will not. Here's a table with different background colors in each cell,
followed by it's HTML code:
| White | Still white |
| Yellow | Blue |
<TABLE BORDER>
<TR BGCOLOR="#FFFFFF">
<TD> White </TD>
<TD> Still white </TD>
</TR>
<TR>
<TD BGCOLOR="#FFFF44"> Yellow </TD>
<TD BGCOLOR="#9999FF"> Blue </TD>
</TR>
</TABLE>
Go up to the questions
You can read more about style sheets on: http://www.w3.org/Style/.
Since the release of Netscape Navigator 2.0 it is possible to
change the color of a piece of text by adding the COLOR
attribute to the FONT tag. The value that goes with the
COLOR attribute is a hexadicimal value,
just like the one that goes with BGCOLOR, TEXT, etc..
If you wanted to make a piece of text green (assuming you have a color
monitor), the code in Netscape would look like this:
<FONT COLOR="#00FF00">This is a piece of text printed in blue</FONT>
Go up to the questions
Here are a few pages that take advantage of background images that are only a few pixels high (or wide):
Another `problem' with tiling is that your picture has to be `seamless'. That means that your picture fits to itself perfectly. Because when the picture will be tiled, the bottom of the picture will be placed against the top of the picture. Also the right side will be placed against the left side. Tom Karlo explains how to make such seamless pictures with Photoshop on http://www.pixelfoundry.com/Toms/Makeback/BODY tags one was able to
create a `fading' effect. Using
more than one BODY tag can be dangerous because only the
first BODY tag will be read! So if you create a `fading'
effect from black to white, only Netscape 1.1 users will see the final page
as the others will only see the first defined background: black...<HTML> <HEAD> <TITLE>A full example</TITLE> </HEAD> <BODY BACKGROUND="background.gif" BGCOLOR="#335021" TEXT="#F7CE96" LINK="#CED2CC" VLINK="#B1C0AC" ALINK="#FFFFFF"> <H1>A huge piece of text</H1><P> Some text in the normal font. As you can see by the way, there is only one <CODE>BODY</CODE> tag. If you use more than one tag, only the first one will taken for your document. The `zoom' effect people created by using multiple <CODE>BODY</CODE> tags only worked due to a bug in Netscape 1.1.<P> <A HREF="http://www.two4u.com/bg-faq/">This is a link where you have already been</A><P> <A HREF="http://Foo.Bar/Pipco/">The infamous link to the page with the 1,000 nude pics of Pamela Anderson</A><P> <HR> <A HREF="http://www.sci.kun.nl/thalia/guide/color/faq.html#example">Go to the FAQ</A> </BODY> </HTML>Go up to the questions
The next example code will result in next page:
<HTML>
<HEAD>
<STYLE TYPE="text/css"><!--
BODY {
background-color: #FFFFFF;
background-image: url(../color/back_10.gif);
background-position: center;
background-repeat: no-repeat;
background-attachment: fixed;
}
--></STYLE>
<TITLE>Background FAQ: Example of fixed background.</TITLE>
</HEAD>
<BODY>
This is a lot of text, just to make sure the page will be scrolling and
that the text will really be scrolling over the background image which
will be centered, non-repeating and non-scrollable... Line 1.
<P>
[... other 19 lines cut away]
<HR>
<A HREF="http://www.two4u.com/bg-faq/#watermark">Go to the FAQ</A>
</BODY>
</HTML>
You can find a more detailed explanation on this page with a complete example.
Directly accessable via WWW:
The Style Sheets specifications have been around for quite some time. The problem with Style Sheets is that they are partly/poorly supported by the two most popular browsers: Netscape Navigator and MSIE. You can read more about them on: http://www.w3.org/Style/. With the arrival of version 5.0 of both browsers, the support for CSS will be a lot better.
Here are some other documents on backgrounds: